<template>
  <router-view/>
</template>
<script setup>

//cookie: 不适合存储大量的数据。
//localStorage: 是永久存储，浏览器关闭后数据不会丢失，除非主动删除数据。当关闭页面后重新打开，会读取上一次打开的页面数据。
//sessionStorage: 在当前浏览器窗口关闭后自动删除。所以，sessionStorage 最合适。

// 入口组件
        // 在页面加载时读取sessionStorage里的状态信息
        import store from "@/store";

        if (sessionStorage.getItem('store')) {
            store.replaceState(
                Object.assign(
                    {},
                    store.state,
                    JSON.parse(sessionStorage.getItem('store'))
                )
            )
        }
        // 在页面刷新时将vuex里的信息保存到sessionStorage里
        // beforeunload事件在页面刷新时先触发
        window.addEventListener('beforeunload', () => {
            sessionStorage.setItem('store', JSON.stringify(store.state))
        })


</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #f5f5f5;
}

</style>
